import 'package:flutter/material.dart';

import 'package:flutter_screenutil/flutter_screenutil.dart';

import '../components/function_entry.dart';
import '../components/return_button.dart';
import 'app_intl.dart';
// import 'component/return_button.dart';
import 'entity/devcie_entity.dart' as device;
// import 'function_entry.dart';
import 'mixins/background_mixin.dart';

/*
 * AppEntry-> CategoryEntry
 * Categroy APP 系列入口
 */
class CategroyEntry extends StatefulWidget {
  CategroyEntry({super.key});

  @override
  _CategroyEntryState createState() => _CategroyEntryState();
}

class _CategroyEntryState extends State<CategroyEntry> with BackgroundMixin {
  List<device.DeviceEntity> get _itemName => [
        device.DeviceEntity(
          name: AppIntl.getString('a_seiral_title'),
          image: AppIntl.getString('a_seiral'),
          flag: device.DeviceType.Serial4_0,
          actionMap: {},
          imageText: '',
        ),
        device.DeviceEntity(
          name: AppIntl.getString('b_seiral_title'),
          image: AppIntl.getString('b_seiral'),
          flag: device.DeviceType.Serial2_0,
          actionMap: {},
          imageText: '',
        ),
        device.DeviceEntity(
          name: AppIntl.getString('m_seiral_title'),
          image: AppIntl.getString('m_seiral'),
          flag: device.DeviceType.Serial3_0,
          actionMap: {},
          imageText: '',
        ),
        device.DeviceEntity(
          name: AppIntl.getString('r_seiral_title'),
          image: AppIntl.getString('r_seiral'),
          flag: device.DeviceType.Serial4_0,
          actionMap: {},
          imageText: '',
        ),
        device.DeviceEntity(
          name: AppIntl.getString('s_seiral_title'),
          image: AppIntl.getString('s_seiral'),
          flag: device.DeviceType.Serial2_0,
          actionMap: {},
          imageText: '',
        ),
        device.DeviceEntity(
          name: AppIntl.getString('d_seiral_title'),
          image: AppIntl.getString('d_seiral'),
          flag: device.DeviceType.Serial2_1,
          actionMap: {},
          imageText: '',
        ),
        device.DeviceEntity(
          name: AppIntl.getString('l_seiral_title'),
          image: AppIntl.getString('l_seiral'),
          flag: device.DeviceType.Serial7_0,
          actionMap: {},
          imageText: '',
        ),
        device.DeviceEntity(
          name: AppIntl.getString('c_seiral_title'),
          image: AppIntl.getString('c_seiral'),
          flag: device.DeviceType.Serial7_0,
          actionMap: {},
          imageText: '',
        ),
      ];

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: const BoxDecoration(
        image: DecorationImage(
          image: AssetImage('assets/background.png'),
          fit: BoxFit.fill,
        ),
      ),

      //功能入口
      child: Stack(
        children: [
          _function(),
          ReturnButton(),
        ],
      ),
    );
  }

  Widget _function() {
    return Positioned(
      left: ScreenUtil().setWidth(80.0),
      right: ScreenUtil().setWidth(80.0),
      height: ScreenUtil().setHeight(400.0),
      top: ScreenUtil().setHeight(180.0),
      child: Container(
        child: _functionItems(),
      ),
    );
  }

  //列表
  Widget _functionItems() {
    // return Row(
    //   children: [
    //     Expanded(child: Container()),
    //     _itemBuilder(context, 0),
    //     Expanded(child: Container()),
    //     _itemBuilder(context, 1),
    //     Expanded(child: Container()),
    //     _itemBuilder(context, 2),
    //     Expanded(child: Container()),
    //   ],
    // );

    return ListView.builder(
      scrollDirection: Axis.horizontal,
      itemExtent: ScreenUtil().setHeight(400),
      shrinkWrap: true,
      physics: BouncingScrollPhysics(),
      itemCount: _itemName.length,
      itemBuilder: _itemBuilder,
    );
  }

  //每一项事件
  GestureTapCallback onTap(int index) {
    if (_itemName[index].flag == device.DeviceType.None) {
      return () => {};
    }
    return () {
      Navigator.of(context).push(
        MaterialPageRoute(
          builder: (context) {
            // ScreenUtil.init(context, designSize: const Size(1334, 750));
            return FunctionEntry(
              deviceEntity: _itemName[index],
            );
          },
        ),
      );
    };
  }

  Widget _itemBuilder(context, index) {
    return GestureDetector(
      onTap: onTap(index),
      child: Container(
        alignment: Alignment(0, 1),
        decoration: BoxDecoration(
          image: DecorationImage(
              image: AssetImage('${_itemName[index].image}'),
              fit: BoxFit.fitHeight),
        ),
        width: ScreenUtil().setHeight(300),
        height: ScreenUtil().setHeight(439),
        child: Text(
          _itemName[index].name,
          style: TextStyle(
              color: Colors.black,
              decoration: TextDecoration.none,
              fontSize: ScreenUtil().setSp(40)),
        ),
      ),
    );
  }
}
